<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta content="text/html;charset=UTF-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link th:href="@{../../static/css/bootstrap.css}" rel="stylesheet">
    <link th:href="@{../../static/css/bootstrap-theme.css}" rel="stylesheet">
    <title>修改个人密码</title>
</head>
<body>
<!--顶部栏-->
<div th:replace="business/top :: html"></div>
<div class="container" id="content">
    <div class="row">
        <div th:replace="business/menu :: html"></div>
        <div class="col-md-10">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="row">
                        <h1 style="text-align: center;">修改个人密码</h1>
                    </div>
                </div>
                <div class="panel-body">
                    <div class="form-group">
                        <label for="oldPassword" class="col-sm-2 control-label">旧密码</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" name="oldPassword" id="oldPassword" placeholder="请输入旧密码" >
                        </div>
                    </div><br><br>
                    <div class="form-group">
                        <label for="password1" class="col-sm-2 control-label">新密码</label>
                        <div class="col-sm-10">
                            <input type="password" name="password1" class="form-control" id="password1" placeholder="请输入新密码">
                        </div>
                    </div><br><br>
                    <div class="form-group">
                        <label for="password2" class="col-sm-2 control-label">确认密码</label>
                        <div class="col-sm-10">
                            <input type="password" name="password2" class="form-control" id="password2" placeholder="请再次输入新密码">
                        </div>
                    </div><br><br>
                    <div class="form-group" style="text-align: center">
                        <button class="btn btn-success" type="submit" onclick="javascript:updatePassword();">提交</button>
                        <button class="btn btn-default">重置</button>
                    </div>
                </div>

            </div>

        </div>
    </div>
</div>
<div class="container" id="footer">
    <div class="row">
        <div class="col-md-12"></div>
    </div>
</div>

<!--消息模态框-->
<div class="modal fade" tabindex="-1" role="dialog" id="alertMsg">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <p th:text="${msg}" id="msg"></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal" onclick="javascript:go();">关闭
                </button>
            </div>
        </div>
    </div>
</div>

<script th:src="@{../../static/js/jquery-3.0.0.min.js}"></script>
<script th:src="@{../../static/js/bootstrap.js}"></script>
<script th:inline="javascript">

    /*<![CDATA[*/

    $("#nav li:nth-child(4)").addClass("active");

    var msg = /*[[${msg}]]*/ null;
    if(msg != null) {
        // 显示信息
        $('#alertMsg').modal('show');
    }


    // 修改密码
    function updatePassword() {
        var firstPass = $('#password1').val();
        var secondPass = $('#password2').val();
        var oldPassword = $('#oldPassword').val();

        if(firstPass == null || firstPass == '' || firstPass == undefined ||
            secondPass == null || secondPass == '' || secondPass == undefined ||
            oldPassword == null || oldPassword == '' || oldPassword == undefined) {
            // 给模态框赋值
            $('#msg').text('请输入完整的数据!');
            $('#alertMsg').modal('show');
            return ;
        }

        if(firstPass !== secondPass) {
            // 给模态框赋值
            $('#msg').text('输入的密码不一致!');
            $('#alertMsg').modal('show');
            return ;
        }

        $.post('/user/passwordReset', {oldPassword: oldPassword, userPassword: firstPass}, function (data, status) {

            if(status == 'success') {
                console.log(data);
                if(data == 0) {
                    // 给模态框赋值
                    $('#msg').text('修改成功!');
                } else if (data == 1){
                    // 给模态框赋值
                    $('#msg').text('没有该用户，出错!');
                } else if (data == 3){
                    // 给模态框赋值
                    $('#msg').text('修改失败!');
                } else if (data == 2){
                    // 给模态框赋值
                    $('#msg').text('输入的旧密码不正确!');
                }
            } else {
                // 给模态框赋值
                $('#msg').text('修改失败!');
            }

            $('#alertMsg').modal('show');

        });
    }

    function go() {
        // 密码修改成功，返回登录界面
        if($('#msg').text() == '修改成功!') {
            window.location.href = '/login';
        }
    }

    /*]]>*/


</script>
</body>
</html>